/*键盘*/
*{	margin: 0; padding: 0;list-style:none;border:0; box-sizing:border-box;}
body{ background-color:#f9fbf9;    max-width: 640px;
    margin: 0 auto;
    background: -webkit-linear-gradient(#6398f1, #a5c6fa); /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(#6398f1, #a5c6fa); /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(#6398f1, #a5c6fa); /* Firefox 3.6 - 15 */
    background: linear-gradient(#6398f1, #a5c6fa); /* 标准的语法 */
}
html{height:100%;overflow: hidden;
}
body{min-height:100%;
    overflow: hidden;
}
.clearfix:after { content: "."; display: block; font-size: 0; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-table;}
*html .clearfix { height: 1%; }
.clearfix { display: block; }
*+html .clearfix { min-height: 1%; }
.che_tit{ text-align:center; padding:20px 0 10px 0;font-size: 18px;
background: url("../images/add_title.png") no-repeat;
    background-size: 100%;
    border-top-left-radius: 9px;
    border-top-right-radius: 9px;
    height: 104px;
}
.notice{
    text-align: center;
    }
.no_title{
    color: #f53d9c;
    font-size: 23px;
    font-weight: 600;
    margin-bottom: 6px;
}
.notice p{
    font-size: 13px;
    color: #5f5a5a;
}
.weather{
    color: white;
    width: 80%;
    margin: 0 auto;
    padding-bottom: 21px;
}
.ul_pro{ background-color:#CED3D9; text-align:center; padding:4px 2px; font-size:14px;}
.ul_pro li{ float:left; width:11.11%; padding:2px;box-sizing: border-box;}
.ul_pro .li_close{  float:right; width:22.22%;}
.ul_pro .li_close span{ background-color:#ACB3BB;}
.ul_pro .li_clean{  float:right; width:22.22%;}
.ul_pro li span{ display:block; background-color:#fff; border-radius:4px; box-shadow: 2px 2px 2px #888888; /* max-width:48px; margin:0 auto; */ line-height:32px; padding-top:2px;  }
.ul_pro li span:active{ background-color:#4DA9F2; color:#fff;}
.ul_input{ padding:20px;width:310px; margin:0 auto; }
.ul_input li{ float:left; width:11.5%; padding:2px;text-align:center; }
.ul_input li span{ display:block; background-color:#fff; border:1px solid #689df2; border-radius:3px; width:26px; margin:0 auto; height:36px; line-height:36px;
    -webkit-box-shadow:#afabab 0px 0px 3px;
    -moz-box-shadow: #afabab 0px 0px 3px;
    box-shadow: #afabab 0px 0px 3px;

}
.car_input{
    margin-top: 4px;
}
.ul_input li.dot{width: 12px;padding-top: 10px}
.query{
    width: 71%;
    text-align: center;
    height: 40px;
    line-height: 40px;
    background-color: #659aee;
    color: white;
    margin:  40px auto;
    border-radius: 40px;
    font-size: 18px;
    -moz-box-shadow:2px 2px 14px #A3A3A3;
    -webkit-box-shadow:2px 2px 14px #A3A3A3;
    box-shadow:2px 2px 14px #A3A3A3;
}

.bg{
    /*width: 82%;*/
    width: 100%;
    margin: 0 auto;
    background: rgba(245, 240, 240, 0.3);
    border-radius: 11px;
    height: 20.7rem ;
    position: relative;
}
.query_input{
    background-color: #f8f8f8;
    width: 98%;
    margin: 0 auto;
    border-radius: 11px;
    height: 407px;
    position: absolute;
    top: 3px;
    left: 3px;
    /*border:4px solid rgba(0.5,0,0,0.1)*/
}
.car_tit{
    color: white;
    font-size: 19px;
    margin-bottom: 6px;
    font-weight: 600;
}
.car_desc{
    color: white;
    font-size: 15px;
}
.ul_keybord{ background-color:#CED3D9; text-align:center; padding:4px 2px; font-size:14px;}
.ul_keybord li{ float:left; width:10%; padding:2px;box-sizing: border-box;}
.ul_keybord .ikey20{ margin-left:5%;}
.ul_keybord .li_w{ width:11.11%; }

.ul_keybord .li_close{  float:right; width:22.22%;}
.ul_keybord .li_close span{ background-color:#ACB3BB;}
.ul_keybord .li_clean{  float:right; width:22.22%;}
.ul_keybord li span{ display:block; background-color:#fff; border-radius:4px; box-shadow: 2px 2px 2px #888888; /* max-width:48px; margin:0 auto; */ line-height:32px; padding-top:2px;  }
.ul_keybord li span:active{ background-color:#4DA9F2; color:#fff;}

.location{
    padding: 10px 0;
    color: white;
    width: 80%;
    margin: 0 auto;
}
.location div{
    display: inline-block;
}
.l_title{
    margin-right: 8px;
}
.l_car{
    font-size: 20px;
    vertical-align: 4px;
    color: #ffffff;
}
.location .l_title img{
    width: 30px;
    vertical-align: -5px;
    margin: 0 2px;
}
.location .l_car img{
    width: 20px;
    vertical-align: -8px;
}

.flip-container{
    width: 92%;
    margin:0 auto;
}
.rotate {
    transform: rotateY(180deg);
    -moz-transform:rotateY(180deg);     /* Firefox */
}

/* flip speed goes here */
.flipper {
    transition: 1s;
    transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    position: relative;
    width: 100%;
}

/* hide back of pane during swap */
.inquiry_fee, .confirm_fee {
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;    /* Chrome 和 Safari */
    -moz-backface-visibility:hidden;     /* Firefox */
    position: absolute;
    top: 0;
    left: 0;
}

/* back, initially hidden pane */
.confirm_fee {
    transform: rotateY(180deg);
    -moz-transform:rotateY(180deg);     /* Firefox */
}
.fee_all{
    width: 83%;
    margin: 0 auto;
    border-top:1px solid #d0d5de;
    border-left:1px solid #d0d5de;
    border-right:1px solid #d0d5de;
    padding:0 18px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.carNum{
    font-size: 22px;
    display: inline-block;
}
.fee_all_content>p,.carNum_info{
    position: relative;
    padding: 6px 0;
}
.right_info{
    position: absolute;
    right: 0;
    color:#659aee;
}
.carNum_info{
    border-bottom: 1px solid #737373;
    padding: 7px 0;
    margin-bottom: 8px;
}
.parkingWay{
    display: inline-block;
    border:2px solid #659aee;
    color:#659aee;
    border-radius:5px;
    top:12px;
    font-size: 11px;
    padding:0 6px;
}
.payMoney{
    padding: 17px 0;
    border-bottom: 1px solid #eaeaea;
}
.payMoney p{
    display: inline-block;
}
.payNum{
    font-size: 30px;
    color: #f71313;
}
.tip{
    display: inline-block;
    width: 70px;
}
.totalMoney {
    font-size: 32px;
}
.payFee{
    padding: 11px 0;
}
.payFee .tip{
    vertical-align: -16px;
}
.circle_l{
    width: 13px ;
    height: 28px;
    border-top:1px solid #d0d5de;
    border-right:1px solid #d0d5de;
    border-bottom:1px solid #d0d5de;
    border-radius: 0 100px 100px 0;
}
.circle_r{
    width: 13px ;
    height: 28px;
    border-top:1px solid #d0d5de;
    border-left:1px solid #d0d5de;
    border-bottom:1px solid #d0d5de;
    border-radius: 100px 0 0 100px;
    position: absolute;
    right: 0;

}
.center_line div{
    display: inline-block;
}
.center_line{
    width: 83%;
    margin:0 auto;
    position: relative;
    height: 28px;
}
.line {
    border-top: 1px dashed #d0d5de;
    width: 89%;
    position: absolute;
    top: 15px;
}
.fee_btn{
    width: 83%;
    margin:0 auto;
    border-left:1px solid #d0d5de;
    border-right:1px solid #d0d5de;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    padding-bottom: 2px;
}
.fee_btn::before {
    content: '';
    position: absolute;
    bottom: -0.125em;
    width: 81%;
    height: 0.25em;
    background: -webkit-linear-gradient(315deg, transparent, transparent 45%, #d0d5de, transparent 55%, transparent 100%), -webkit-linear-gradient(45deg, transparent, transparent 45%, #d0d5de, transparent 55%, transparent 100%);
    background: linear-gradient(135deg, transparent, transparent 45%, #d0d5de, transparent 55%, transparent 100%), linear-gradient(45deg, transparent, transparent 45%, #d0d5de, transparent 55%, transparent 100%);
    background-size: 0.5em 0.5em;
    background-repeat: repeat-x, repeat-x;
}
.fee_info{
    position: relative;
}
.fee_btn p{
    font-size: 13px;
    color:#4d4d4d;
    text-align: center;
    padding-top: 8px;
}
.fee_btn p img{
    width: 15px;
    margin-left: 6px;
    vertical-align: -2px;
}
.fee_btn a{
    color:#4d4d4d;
}
.fee_btn .query{
    margin: 10px auto;
}


/*支付选择块*/
.payBg {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #000;
    opacity: .55;
    filter: alpha(opacity=75);
    display: none;
}
.payChoose{
    position: absolute;
    bottom:0;
    background: white;
    width: 100%;
    height: 215px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    display: none;
}
.payContent{
    width: 80%;
    margin:0 auto;
    padding:20px 0
}
.payChoose  img{
    width: 30px;
    height: 30px;
    vertical-align: -10px;
}
.payContent>div{
    position: relative;
    padding:17px 0 5px 0;
    border-bottom: 1px solid #d7d7d7;
}
.payContent span{
    position: absolute;
    right: 0;
    bottom: 10px;
}


@media only screen and (min-width: 640px){
    html{
        font-size: 27px;
    }
}
@media only screen and (min-width: 414px) and (max-width: 639px){
    html{
        font-size: 19px;
    }
}
@media only screen and (min-width: 375px) and (max-width: 413px){
    html{
        font-size: 19px;
    }
}
@media only screen and (max-width: 374px){
    html{
        font-size: 19px;
    }
}
